<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>云钢</title>
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-flex.css">
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <style>
        body{ background-color: white; }
        .aui-bar-nav.aui-bar-light .aui-iconfont{ color: black; }
        .aui-searchbar{ background-color: #ffffff; }
        .aui-searchbar-input{ background-color: #F5F5F5; border-radius: 1.4rem; }
        .xq{ position: absolute; right: 0.5rem; bottom: 0.5rem; background-color: #78B8FF !important; }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <header class="aui-bar aui-bar-nav aui-bar-light" id="header">
            <a class="aui-pull-left aui-btn">
                <span class="aui-iconfont aui-icon-left"></span>
            </a>
            <div class="aui-title" style="left:2rem; right: 0.5rem;">
                <div class="aui-searchbar" id="search">
                    <div class="aui-searchbar-input aui-border-radius">
                        <i class="aui-iconfont aui-icon-search"></i>
                        <input type="search" placeholder="请输入关键词" id="search-input">
                        <div class="aui-searchbar-clear-btn">
                            <i class="aui-iconfont aui-icon-close"></i>
                        </div>
                    </div>
                    <div class="aui-searchbar-btn" tapmode="">取消</div>
                </div>
            </div>
        </header>
        <div class="margin-top padding">热门搜索</div>
        <div class="margin-top">
            <div class="aui-flex-col">
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">钢材</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">回收</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">钢架子</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">料</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">废料</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">供应</div>
                </div>
                <div class="aui-flex-item-3">
                    <div class="margin text-center padding-xs padding-lr bg-gray round">钢铁业</div>
                </div>
            </div>
        </div>
        <div class="bg-gray">
            <div class="bg-white">
                <ul class="aui-list aui-list-in">
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner aui-list-item-arrow">
                            <div class="aui-list-item-title">货物资源</div>
                            <div class="aui-list-item-right">全部（20）</div>
                        </div>
                    </li>
                </ul>
                <div class="aui-card-list aui-border-t aui-border-b">
                    <div class="aui-card-list-header aui-card-list-user">
                        <div class="aui-card-list-user-avatar">
                            <img src="../../image/me/header.jpg" class="aui-img-round">
                        </div>
                        <div class="aui-card-list-user-name">
                            <div class="aui-font-size-16">钢材售卖货品名称</div>
                            <div class="aui-text-danger text-md text-bold">1.2元/吨</div>
                        </div>
                        <div class="aui-card-list-user-info">
                            <div class="aui-label aui-label-success aui-label-outlined">重型料</div>
                        </div>
                    </div>
                    <div class="aui-card-list-content aui-border-t" style="margin-left: 3.2rem;">
                        <ul class="aui-list aui-list-noborder">
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title aui-text-danger">
                                        <i class="aui-iconfont aui-icon-calendar"></i>
                                        <span class="aui-text-danger">剩余数量：548吨</span>
                                    </div>
                                </div>
                            </div>
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title text-gray">
                                        <i class="aui-iconfont aui-icon-date"></i>
                                        <span class="text-gray">时间：2021-04-26 17:23</span>
                                    </div>
                                </div>
                            </div>
                        </ul>
                        <div class="aui-btn aui-btn-info round xq">了解详情</div>
                    </div>
                </div>
                <div class="aui-card-list aui-border-t aui-border-b">
                    <div class="aui-card-list-header aui-card-list-user">
                        <div class="aui-card-list-user-avatar">
                            <img src="../../image/me/header.jpg" class="aui-img-round">
                        </div>
                        <div class="aui-card-list-user-name">
                            <div class="aui-font-size-16">钢材售卖货品名称</div>
                            <div class="aui-text-danger text-md text-bold">1.2元/吨</div>
                        </div>
                        <div class="aui-card-list-user-info">
                            <div class="aui-label aui-label-success aui-label-outlined">重型料</div>
                        </div>
                    </div>
                    <div class="aui-card-list-content aui-border-t" style="margin-left: 3.2rem;">
                        <ul class="aui-list aui-list-noborder">
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title aui-text-danger">
                                        <i class="aui-iconfont aui-icon-calendar"></i>
                                        <span class="aui-text-danger">剩余数量：548吨</span>
                                    </div>
                                </div>
                            </div>
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title text-gray">
                                        <i class="aui-iconfont aui-icon-date"></i>
                                        <span class="text-gray">时间：2021-04-26 17:23</span>
                                    </div>
                                </div>
                            </div>
                        </ul>
                        <div class="aui-btn aui-btn-info round xq">了解详情</div>
                    </div>
                </div>
            </div>

            <div class="bg-white margin-top">
                <ul class="aui-list aui-list-in">
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner aui-list-item-arrow">
                            <div class="aui-list-item-title">采购信息</div>
                            <div class="aui-list-item-right">全部（20）</div>
                        </div>
                    </li>
                </ul>
                <div class="aui-card-list aui-border-t aui-border-b">
                    <div class="aui-card-list-header aui-card-list-user">
                        <div class="aui-card-list-user-avatar">
                            <img src="../../image/me/header.jpg" class="aui-img-round">
                        </div>
                        <div class="aui-card-list-user-name">
                            <div class="aui-font-size-16">钢材售卖货品名称</div>
                            <!-- <div class="aui-text-danger text-md text-bold">1.2元/吨</div> -->
                        </div>
                        <div class="aui-card-list-user-info">
                            <div class="aui-label aui-label-success aui-label-outlined">重型料</div>
                        </div>
                    </div>
                    <div class="aui-card-list-content aui-border-t" style="margin-left: 3.2rem;">
                        <ul class="aui-list aui-list-noborder">
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title aui-text-danger">
                                        <i class="aui-iconfont aui-icon-calendar"></i>
                                        <span class="aui-text-danger">所需数量：548吨</span>
                                    </div>
                                </div>
                            </div>
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title text-gray">
                                        <i class="aui-iconfont aui-icon-date"></i>
                                        <span class="text-gray">时间：2021-04-26 17:23</span>
                                    </div>
                                </div>
                            </div>
                        </ul>
                        <div class="aui-btn aui-btn-info round xq">了解详情</div>
                    </div>
                </div>
                <div class="aui-card-list aui-border-t aui-border-b">
                    <div class="aui-card-list-header aui-card-list-user">
                        <div class="aui-card-list-user-avatar">
                            <img src="../../image/me/header.jpg" class="aui-img-round">
                        </div>
                        <div class="aui-card-list-user-name">
                            <div class="aui-font-size-16">钢材售卖货品名称</div>
                            <!-- <div class="aui-text-danger text-md text-bold">1.2元/吨</div> -->
                        </div>
                        <div class="aui-card-list-user-info">
                            <div class="aui-label aui-label-success aui-label-outlined">重型料</div>
                        </div>
                    </div>
                    <div class="aui-card-list-content aui-border-t" style="margin-left: 3.2rem;">
                        <ul class="aui-list aui-list-noborder">
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title aui-text-danger">
                                        <i class="aui-iconfont aui-icon-calendar"></i>
                                        <span class="aui-text-danger">所需数量：548吨</span>
                                    </div>
                                </div>
                            </div>
                            <div class="aui-list-item aui-padded-l-0" style="min-height: 1.2rem;">
                                <div class="aui-list-item-inner" style="min-height: 1.2rem;">
                                    <div class="aui-list-item-title aui-font-size-14 goods-title text-gray">
                                        <i class="aui-iconfont aui-icon-date"></i>
                                        <span class="text-gray">时间：2021-04-26 17:23</span>
                                    </div>
                                </div>
                            </div>
                        </ul>
                        <div class="aui-btn aui-btn-info round xq">了解详情</div>
                    </div>
                </div>
            </div>

            <div class="bg-white margin-top">
                <ul class="aui-list aui-list-in">
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner aui-list-item-arrow">
                            <div class="aui-list-item-title">行业资讯</div>
                            <div class="aui-list-item-right">全部（20）</div>
                        </div>
                    </li>
                </ul>
                <div class="aui-flex-col padding bg-white margin margin-top-0">
                    <div class="aui-flex-item-8">
                        <div class="text-black padding-right-xs" style="font-size:0.75rem;">中国浙江生长的这种树,比钢铁还 要硬,可用于航天设备零件制造!</div>
                        <div class="text-gray text-sm margin-tb-xs">2021-04-27 10:25</div>
                        <div class="text-gray">
                            <i class="aui-iconfont aui-icon-display"></i>
                            <span class="text-sm margin-right-xxl">56</span>
                            <i class="aui-iconfont aui-icon-comment"></i>
                            <span class="text-sm margin-right-xxl">10</span>
                            <i class="aui-iconfont aui-icon-laud"></i>
                            <span class="text-sm">26</span>
                        </div>
                    </div>
                    <div class="aui-flex-item-4">
                        <img src="../../image/image.jpg" style="width: 100%;height: auto;">
                    </div>
                </div>
                <div class="aui-flex-col padding bg-white margin margin-top-0">
                    <div class="aui-flex-item-8">
                        <div class="text-black padding-right-xs" style="font-size:0.75rem;">中国浙江生长的这种树,比钢铁还 要硬,可用于航天设备零件制造!</div>
                        <div class="text-gray text-sm margin-tb-xs">2021-04-27 10:25</div>
                        <div class="text-gray">
                            <i class="aui-iconfont aui-icon-display"></i>
                            <span class="text-sm margin-right-xxl">56</span>
                            <i class="aui-iconfont aui-icon-comment"></i>
                            <span class="text-sm margin-right-xxl">10</span>
                            <i class="aui-iconfont aui-icon-laud"></i>
                            <span class="text-sm">26</span>
                        </div>
                    </div>
                    <div class="aui-flex-item-4">
                        <img src="../../image/image.jpg" style="width: 100%;height: auto;">
                    </div>
                </div>
            </div>

            <div class="bg-white margin-top">
                <ul class="aui-list aui-list-in">
                    <li class="aui-list-item">
                        <div class="aui-list-item-inner aui-list-item-arrow">
                            <div class="aui-list-item-title">商机资讯</div>
                            <div class="aui-list-item-right">全部（20）</div>
                        </div>
                    </li>
                </ul>
                <div class="padding bg-white margin margin-top-0">
                    <div class="text-black padding-right-xs" style="font-size:0.75rem;">中国浙江生长的这种树,比钢铁还要硬,可用于航天...</div>
                    <div class="text-gray">
                        <i class="aui-iconfont aui-icon-display"></i>
                        <span class="text-sm margin-right-xl">366</span>
                        <span class="text-sm">2021-04-27 10:25</span>
                    </div>
                </div>
            </div>
        </div>
        

    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/vue.js"></script>
<script type="text/javascript">

    var vm = {
        el: '#app',
        data: {
            list: []
        },
        mounted: function(){
            this.getList();
        },
        methods: {
            getList: function(){
                let that = this;
            }
        }
    }
    apiready = function() {
        $api.fixStatusBar(
            $api.byId("header")
        );
        window.app = new Vue(vm);


    };

    function backpage(){
        api.closeWin({
            name: api.winName
        })
        
    }

</script>

</html>
